/* Tiny Scrollbar */
#scrollbar1 { width: 170px; margin: 20px 0 10px; height: 90%}
#scrollbar1 .viewport { width: 160px; height: 100%; overflow: hidden; position: relative; }
#scrollbar1 .overview { list-style: none; position: absolute; left: 0; top: 0; padding: 0; margin: 0; }
#scrollbar1 .scrollbar{ background: transparent url(../images/bg-scrollbar-track-y.png) no-repeat 0 0; position: relative; background-position: 0 0; float: right; width: 6px; }
/*#scrollbar1 .track { background: transparent url(../images/bg-scrollbar-trackend-y.png) no-repeat 0 100%; height: 100%; width:4px; position: relative; padding: 0 1px; }*/
#scrollbar1 .track { background-color:rgba(150, 150, 150, 0.6) ; width: 100%; height:10px; position: relative; border-radius: 3px;   }

/*#scrollbar1 .thumb { background: transparent url(../images/bg-scrollbar-thumb-y.png) no-repeat 50% 100%; height: 20px; width: 6px; cursor: pointer; overflow: hidden; position: absolute; top: 0; left: 0px; }*/
/*#scrollbar1 .thumb .end { background: transparent url(../images/bg-scrollbar-thumb-y.png) no-repeat 50% 0; overflow: hidden; height: 5px; width: 6px; }*/
#scrollbar1 .thumb .end { background-color:rgba(0, 0, 0, 0.0) ; overflow: hidden; height: 5px; width: 6px; border-radius: 2px 2px 0 0}
#scrollbar1 .thumb {
    background-color:rgba(0, 0, 0, 0.6) ;
    height: 10px; cursor: pointer; overflow: hidden;
    position: absolute; left: 0px; top: 0px; z-index:5;
    border-radius: 3px;
    box-shadow: 0 1px 1px rgba(0,0,0,0.6),0 -1px 1px rgba(0,0,0,0.6);
}
#scrollbar1 .disable { display: none; }


#scrollbar2 { width: 100%; margin: 20px 0 10px; height: 90%}
#scrollbar2 .viewport { width: 160px; height: 100%; overflow: hidden; position: relative; }
#scrollbar2 .overview { list-style: none; position: absolute; left: 0; top: 0; padding: 0; margin: 0; }
#scrollbar2 .scrollbar{ background: transparent url(../images/bg-scrollbar-track-y.png) no-repeat 0 0; position: relative; background-position: 0 0; float: right; width: 6px; }
#scrollbar2 .track { background: transparent url(../images/bg-scrollbar-trackend-y.png) no-repeat 0 100%; height: 100%; width:4px; position: relative; padding: 0 1px; }
#scrollbar2 .thumb { background: transparent url(../images/bg-scrollbar-thumb-y.png) no-repeat 50% 100%; height: 20px; width: 6px; cursor: pointer; overflow: hidden; position: absolute; top: 0; left: 0px; }
#scrollbar2 .thumb .end { background: transparent url(../images/bg-scrollbar-thumb-y.png) no-repeat 50% 0; overflow: hidden; height: 5px; width: 6px; }
#scrollbar2 .disable { display: none; }
.noSelect { user-select: none; -o-user-select: none; -moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none; } 

#scrollbar3 { width: 100%; margin: 0px ; height: 100%; }
#scrollbar3 .viewport { width: 100%; height:100%; overflow: hidden; position: relative; margin-top: 0px; }
#scrollbar3 .overview { list-style: none; width: 100%; padding: 0; margin: 0; position: absolute; left: 0px; top: 0;  }
#scrollbar3 .overview img{ float: left; }
#scrollbar3 .scrollbar{  position: relative; margin: 0px; margin-top: -15px; clear: both; height: 15px; }
#scrollbar3 .track { background-color:rgba(150, 150, 150, 0.6) ; width: 100%; height:10px; position: relative; border-radius: 5px;   }
#scrollbar3 .thumb { background-color:rgba(0, 0, 0, 0.6) ; height: 10px; cursor: pointer; overflow: hidden; position: absolute; left: 0px; top: 0px; z-index:5; border-radius: 5px;  }

#scrollbar3 .disable { display: none; }



#scrollbar4 { width: 100%; margin: 20px 0 10px; height: 90%}
#scrollbar4 .viewport { width: 380px; height: 100%; overflow: hidden; position: relative; }
#scrollbar4 .overview { list-style: none; position: absolute; left: 0; top: 0; padding: 0; margin: 0; }
#scrollbar4 .scrollbar{ background: rgba(0,0,0,0.4); position: relative; background-position: 0 0; float: right; width: 10px; border-radius: 5px; border: 1px solid #ff8a00 }
#scrollbar4 .track { background: transparent; height: 100%; width:10px; position: relative; padding: 0 1px; }
#scrollbar4 .thumb { background: rgba(0,0,0,0.6); height: 20px; width: 10px; cursor: pointer; overflow: hidden; position: absolute; top: 0; left: 0px; border-radius: 5px;}
#scrollbar4 .thumb .end { background: rgba(0,0,0,0); overflow: hidden; height: 5px; width: 6px; border-radius: 4px 4px 0 0}
#scrollbar4 .disable { display: none; }
.noSelect { user-select: none; -o-user-select: none; -moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none; }



